<template>
  <div class="gi_page container">
    <a-card class="general-card">
      <a-grid :cols="24" :col-gap="12" :row-gap="12">
        <a-grid-item :span="{ xs: 24, sm: 24, md: 24, lg: 24, xl: 12, xxl: 12 }">
          <PayoutsRequest/>
        </a-grid-item>
        <a-grid-item :span="{ xs: 24, sm: 24, md: 24, lg: 24, xl: 12, xxl: 12 }">
          <EarningsTrends/>
        </a-grid-item>
      </a-grid>
    </a-card>
  </div>
</template>

<script setup lang="ts">
import PayoutsRequest from "./PayoutsRequest.vue";
import EarningsTrends from "./EarningsTrends.vue";

defineOptions({name: 'MusicianEarnings'})
</script>

<style scoped lang="scss"></style>
